<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
    <body>
        <script>
        var clientH = document.documentElement.clientHeight;
        var body = document.body;

        init()
        // 起始生成，撑大页面
        function init() {
            while (body.offsetHeight < clientH + 300) {
                var p = document.createElement('p');
                p.innerText = '黄河之水天上来，奔流到海不复回。';
                body.insertBefore(p, document.querySelector('script'));
            }
        }
        window.onscroll = function () {
            while(body.offsetHeight -  window.pageYOffset - clientH < 50) {
                var p = document.createElement('p');
                p.innerText = 'hello,world!!';
                body.insertBefore(p, document.querySelector('script'));
                console.log('move...');
            }
        }
        // 节流写法
        window.onscroll = move(function () {
            while(body.offsetHeight -  window.pageYOffset - clientH < 50) {
                var p = document.createElement('p');
                p.innerText = 'hello,world!!';
                body.insertBefore(p, document.querySelector('script'));
                console.log('move...');
            }
        }, 50)

        function move(func, wait) {
            // 起始时间
            var startTime = new Date();
            return function () {
                // move过程中执行 现在时间
                var nowTime = new Date();
                // 时间差大于wait
                if (nowTime - startTime > wait) {
                    func()
                    // 改变起始时间为现在时间
                    startTime = nowTime;
                }
            }
        }
    </script>
</body>
</html>